/*
 * @Author: xianfuyou
 * @Date: 2022-03-31 09:29:02
 * @LastEditors: your name
 * @LastEditTime: 2022-04-02 13:31:09
 * @Description: file content
 */
import React from 'react'
import { Modal, Table, Radio, Checkbox } from 'antd';
import { FormOutlined } from '@ant-design/icons'


const columns = [
  {
    title: '字段名称',
    dataIndex: 'fieldsName',
    key: 'fieldsName'
  },
  {
    title: '显示名称',
    dataIndex: 'showName',
    key: 'showName',
    render: (showName) => {
      return <>
        {showName}<FormOutlined style={{ 'color': "#577cc1", "cursor": "pointer" }} />
      </>
    }
  },
  {
    title: '列表显示',
    dataIndex: 'listShow',
    key: 'listShow',
    render: (listShow) => {
      return <Checkbox checked={true}></Checkbox>
    }
  },
  {
    title: '是否必填',
    dataIndex: 'isRequire',
    key: 'isRequire',
    render: (isRequire) => {
      return <Checkbox checked={false}></Checkbox>
    }
  },
];

const data = [
  {
    key: 'orderId',
    fieldsName: '订单编号',
    showName: '订单编号',
    listShow: 1,
    isRequire: 0,
  },
  {
    key: 'telPerson',
    fieldsName: '联系人',
    showName: '联系人',
    listShow: 1,
    isRequire: 1,
  },
  {
    key: 'downOrder',
    fieldsName: '下单日期',
    showName: '下单日期',
    listShow: 0,
    isRequire: 1,
  }, {
    key: 'overOrder',
    fieldsName: '交单日期',
    showName: '交单日期',
    listShow: 0,
    isRequire: 1,
  },
  {
    key: 'payOver',
    fieldsName: '已收款',
    showName: '已收款',
    listShow: 0,
    isRequire: 1,
  },
  {
    key: 'remark',
    fieldsName: '备注',
    showName: '备注',
    listShow: 0,
    isRequire: 1,
  }, {
    key: 'putawayPerson',
    fieldsName: '收货人',
    showName: '收货人',
    listShow: 0,
    isRequire: 1,
  }, {
    key: 'putawayPersonPhone',
    fieldsName: '收货人电话',
    showName: '收货人电话',
    listShow: 0,
    isRequire: 1,
  },
  {
    key: 'putawayAddress',
    fieldsName: '收货人地址',
    showName: '收货人地址',
    listShow: 0,
    isRequire: 1,
  },
];

export default function ModelCpn(props) {
  const { isShow, pHandleOk, pHandleCancel } = props

  const [value, setValue] = React.useState(1);

  const onChange = e => {
    console.log('radio checked', e.target.value);
    setValue(e.target.value);
  };
  const handleOk = () => {
    console.log('handleOk')
    pHandleOk(false);
  };

  const handleCancel = () => {
    console.log('handleCancel')
    pHandleCancel(false);
  };


  return (
    <>
      <Modal title="自定义设置" okText="保存" cancelText="取消" visible={isShow} onOk={handleOk} onCancel={handleCancel}>
        <Table columns={columns} dataSource={data} pagination={false} />
        {/* <Radio.Group onChange={onChange} value={value}>
      <Radio value={1}>A</Radio>
      <Radio value={2}>B</Radio>
      <Radio value={3}>C</Radio>
      <Radio value={4}>D</Radio>
    </Radio.Group> */}
      </Modal>
    </>
  )
}
